<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>用户注册</title>
		<link rel="stylesheet" href="../../css/index/iconfont.css" type="text/css" charset="utf-8" />
		<link rel="stylesheet" href="../../css/index/style.css" type="text/css" charset="utf-8" />
		<link rel="stylesheet" href="../../css/index/member.css" type="text/css" charset="utf-8" />
		<link rel="stylesheet" href="../../css/index/mui.min.css" type="text/css" charset="utf-8" />

	</head>
	<style>
		.icon-dianhua:before,
		.icon-yanzhengyanzhengma:before {
			color: white;
		}
		
		.login_con {
			background: #3AB246;
		}
		
		.mui-input {
			margin-top: .8rem;
		}
		
		.pwd_img {
			width: 30px;
			height: 30px;
		}
		
		.login_formbox label~input {
			font-size: 1.1rem;
		}
		
		.login_btn {
			margin-top: 1rem;
		}
		
		.btn_b{
			border-radius: 25px;
		}
		
		.fl_yanzm input {
			display: block;
			float: right;
			background: #EEEEEE;
			font-size: .8rem;
			width: 25%;
			text-align: center;
			height: 1.5rem;
			line-height: 1.5rem;
			border-radius: 25px;
		}
	</style>

	<body>
		<div class="mui-content login_con">
			<div class="login_top"><img src="../../images/index/shop_mobile.png"></div>
			<form id='login-form' class="login_formbox">
				<div class="mui-input-row">
					<label><img src="../../images/index/phone.png" class='pwd_img'></label>
					<input id='account' type="text" class="mui-input-clear mui-input" placeholder="请输入手机号码">
				</div>
				<div class="mui-input-row">
					<label><img src="../../images/index/pwd.png" class='pwd_img'></label>
					<input id='password' type="password" class="mui-input-clear mui-input" placeholder="请输入登录密码">
				</div>
				<div class="mui-input-row fl_yanzm">
					<div class="left clearfix">
						<label><span class=""></span></label>
						<input id='yzm' type="text" class="mui-input-clear mui-input" placeholder="请输入验证码">
					</div>
					<input type="button" value="获取验证码" class="btn_b" onclick="sendcode(this)" />
					<!--<a href="javascript:;" id="send_code" onclick="sendcode(this)" >获取验证码</a>-->
				</div>
				<input type="hidden" name='type' id="type">
			</form>
			<div style="width: 80%;margin: 0 auto;">
				<button class="mui-btn mui-btn-block login_btn" id='login' style="color: #3ab246;">注册</button>
			</div>
		</div>
	</body>

</html>

<script src="../../js/layer_mobile/layer.js"></script>
<script src="../../js/mui.min.js"></script>
<script src="../../js/mui.enterfocus.js"></script>
<script src="../../js/app.js"></script>
<script src="../../js/m.js"></script>
<script>
	mui.init();
	mui.plusReady(function() {});
	var clock = '';
	var nums = 60; //定义定时器的默认秒数
	var fscode;

	function sendcode(code) {
		fscode = code;
		var phone = document.getElementById('account').value;
		if(!isPoneAvailable(phone)) {
			plus.nativeUI.toast('请输入正确的手机格式');
			return;
		}

		var data2 = {
			mobile: phone
		};
		
		console.log(set.base_url + "index/index/verify_code");
		mui.ajax({
			url: set.base_url + "index/index/verify_code",
			type: 'POST',
			dataType: 'json',
			data: data2,
			success: function(result) {
				if(result.status == 1) {
					plus.nativeUI.toast(result.msg);
					//验证码定时器
					fscode.disabled = true; //将按钮置为不可点击
					fscode.value = nums + '秒后';
					fscode.classname = '';
					clock = setInterval(doLoop, 1000); //一秒执行一次
				} else {
					plus.nativeUI.toast(result.msg);
				}
			},
			error: function(xhr, type, errorThrown) {
				console.log(JSON.stringify(xhr));
				plus.nativeUI.toast("操作失败");
				plus.nativeUI.closeWaiting();
			}
		});
	}

	function doLoop() {
		nums--;
		if(nums > 0) {
			fscode.value = nums + '秒后失效';
		} else {
			clearInterval(clock); //清除js定时器
			fscode.disabled = false;
			fscode.value = '获取验证码';
			fscode.classname = 'zphone';
			nums = 60; //重置时间
		}
	}
</script>